<template>
  <div class="box">
        <div class="box-bt">
            <!-- <router-link to="orderlistrefund"> -->
                <img src="/src/assets/imgs/Snipaste_2022-08-30_09-36-33.png" />
            <!-- </router-link> -->
            <span>退款详情</span>
        </div>
        <div class="tkje">
          <div class="tk-1">

            <div class="tk-1-1">
              <p><span class="s1">退款金额</span></p>
              <p><span class="s2">￥399.00</span></p>
            </div>

            <div class="tk-1-2">
              <span class="sp1">支付方式</span>
              <span class="sp2">支付宝</span>
            </div>

            <div class="tk-1-3">
              <span class="sp1">退款方式</span>
              <span class="sp2">支付宝</span>
            </div>
          </div>
        </div>

        <div class="tkbj">
          <van-steps direction="vertical"
           inactive-icon="checked" active-color='#82b3cb'
           inactive-color='#82b3cb' finish-icon="checked">
            <van-step>
              <h3 class="bt1">到账成功</h3>
              <p class="sj1">2022-02-16 15:36:25</p>
              <p class="sj2">已退回到您的支付宝账户</p>
            </van-step>
            <van-step>
              <h3 class="bt1">医生审核中</h3>
              <p class="sj1">2022-02-16 15:36:25</p>
              <p class="sj2">将在24小时内处理您的退款请求，请耐心等待。</p>
            </van-step>
            <van-step>
              <h3 class="bt1">退款申请已提交</h3>
              <p class="sj1">2022-02-16 15:36:25</p>
              <p class="sj2">您的退款申请提交成功。</p>
              <p class="sj2">退款原因：没时间/不想去</p>
            </van-step>
          </van-steps>
        </div>
  <div id="fefunddetail-box">
    <div id="fefunddetail-heard">

    </div>
  </div>

</template>

<script setup lang='ts'>

</script>

<style scope>
body{background: #f3f1ef;}
.box{background: #f3f1ef;height: 100%;}
.box-bt{height: 40px;text-align: center;line-height: 40px;background: white;}
.box-bt img{float: left;vertical-align: middle;}
.box-bt span{margin-right: 70px;}
  #fefunddetail-box{width: 390px; height: 1000px; background-color: #f2f2f2;}
  #fefunddetail-heard{width: 100%; height: 15%; background-color: #ec7b67;}

.tkje{margin-top: 5px;background: white;height: 200px;}
.tk-1-1{height: 120px;text-align: center;}
.s1{font-size: 14px;color: #999999;}
.s2{font-size: 24px;font-weight: bolder;}
.tk-1-2{height: 40px;text-indent: 20px;}
.tk-1-3{height: 40px;text-indent: 20px;}
.sp1{color: #999999;}
.sp2{float: right;margin-right: 10px;}

.tkbj{margin-top: 20px;}
.van-step__circle-container{color:#82b3cb ;}
.van-step--vertical{font-size: 20px;}
.bt1{font-size: 16px;}
.sj1{float: right; font-size: 12px; color: #999999;}
.sj2{font-size: 12px;color: #999999;margin-top: 10px;}
</style>